
<!DOCTYPE html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>企业或机构注册</title>
    <!-- <link href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> -->
    <link href="../css/bootstrap/bootstrap.min.css" rel="stylesheet">
    <link href="../css/global.css" rel="stylesheet">
</head>

<body>
    <!--1.0 narbar -->
    <div   class="fixedNavbar">
       <#include "../navbar.html">
	</div>

    <!-- 2.0 register form-->
    <div class="container" style="margin-top:15px;">
        <form id="registerForm" class="form-horizontal" role="form">
            <div class="panel panel-default">
                <div class="panel-heading" style="font-weight:bold;">企业注册</div>
                <div class="panel-body">
                     <div class="form-group" id="corporationDiv">
                        <label for="companyName" class="col-sm-2 control-label">企业/机构名</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" name="companyName" id="companyName" placeholder="请输入企业/机构名">
                        </div>
                        <span class="col-xs-6 help-block" style="color:red;"></span>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">所在省</label>
                        <div class="col-sm-3">
                            <select name="province" id="province" class="form-control">
                                <option value="default">请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">所在市</label>
                        <div class="col-sm-3">
                            <select name="city" id="city" class="form-control">
                                <option value="default">请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">所在区</label>
                        <div class="col-sm-3">
                            <select name="district" id="district" class="form-control col-sm-2">
                                <option value="default">请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="realname" class="col-sm-2 control-label">管理员姓名</label>
                        <div class="col-sm-3">
                            <input class="form-control" name="realname" id="realname" placeholder="请输入管理员姓名">
                        </div>
                        <span class="col-xs-6 help-block" style="color:red;"></span>
                    </div>
                    <div class="form-group">
                        <label for="mobile" class="col-sm-2 control-label">管理员手机</label>
                        <div class="col-sm-3">
                            <input type="phone" class="form-control" name="mobile" id="mobile" placeholder="输入手机号">
                        </div>
                        <span class="col-xs-6 help-block" style="color:red;"></span>
                    </div>
                    <div class="form-group">
                       <label for="smsCode" class="col-sm-2 control-label">手机验证码</label>
                       <div class="col-sm-3">
                           <input class="form-control" name="smsCode" id="smsCode" placeholder="点击按钮获取验证码">
                           <a class="btn btn-success get-code-btn" href="javascript:void(0);" id="sendSmsCode" title="免费获取验证码">免费获取验证码</a>
                       </div>
                       <span class="red" style="margin-left: 3px; font-size: 12px;display:none;" name="校验提示"> * 必填</span>
                       <span class="col-xs-6 help-block code-tip" style="color:red;" id="codeTip"></span>
                    </div>
                    <div class="form-group">
                        <label for="email" class="col-sm-2 control-label">管理员邮箱</label>
                        <div class="col-sm-3">
                            <input type="email" class="form-control" name="email" id="email" placeholder="输入邮箱">
                        </div>
                        <span class="col-xs-6 help-block" style="color:red;"></span>
                    </div>
                    <div class="form-group">
                        <label for="password" class="col-sm-2 control-label">密码</label>
                        <div class="col-sm-3">
                            <input type="password" class="form-control" name="password" id="password" placeholder="请输入管理员密码">
                        </div>
                        <span class="col-xs-6 help-block" style="color:red;"></span>
                    </div>
                    <div class="form-group">
                        <label for="confirmPass" class="col-sm-2 control-label">确认密码</label>
                        <div class="col-sm-3">
                            <input type="password" class="form-control" name="confirmPass" id="confirm-pass" placeholder="请再次输入密码">
                        </div>
                        <span class="col-xs-6 help-block" style="color:red;"></span>
                    </div>
                    <div class="form-group">
                        <label for="verifyCode" class="col-sm-2 control-label">验证码</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" name="verifyCode" id="verify-code" placeholder="请输入下方验证码">
                            <img src = "../verify" style = "float:left;display:inline-block;cursor:pointer;" id = "verify-code-img"/>
                        </div>
                    </div>
                    <div class="panel-footer">
                        <div class="form-group">
                            <div class="col-sm-offset-2 col-sm-3">
                                <button type="submit" id="btn-register" class="btn btn-primary">马上注册</button>
                            	<label id="register-hint" class="error" for="submit"></label>
                            </div>
                        </div>
                    </div>
               </div>
             </div>
        </form>
    </div>


    <script src="../js/bootstrap/jquery-1.11.1.min.js"></script>
    <script src="../js/jquery.validate.js"></script>
    <script src="../js/bootstrap/bootstrap.min.js"></script>
	<script src="../js/common.js"></script>
	<script src="../js/util.js"></script>
	<script src="../js/sha1.js"></script>
    <script>
    	$(function(){
    		//1.0  文本验证码
    		$("#verify-code-img").bind("click", function(e) {
				this.src = "../verify?d=" + new Date(); 
			});
    		
    		//2.0 短信验证码
    		function time_out(obj){
    			if(wait == 0){
    				$("#sendSmsCode").html("免费获取验证码");
    				if(!$("#sendSmsCode").hasClass("get-code-btn")){
    					$("#sendSmsCode").removeClass("wait-code-btn").addClass("get-code-btn");
    				}
    				wait = 60;
    			}else{
    				$("#sendSmsCode").html( "重新发送（" + wait +"）");
    				wait --;
    				setTimeout(function(){time_out(obj);},1000);
    			}
    		}
    		//lvyq 发送验证码
    		$("#sendSmsCode").click(function(){
				if($(this).hasClass("get-code-btn")){
	    			$("#codeTip").html("");
	    			var str = $("#mobile").val();
	    			$.ajax({
	    				url:"/eoip/web/checkUserMobile",
	    				type:"POST",
	    				data:{mobile:str},
	    				dataType:"json",
	    				success:function(msg){
		    					console.log(msg);
		    					if(msg == "1"){
		    						$("#sendSmsCode").removeClass("get-code-btn").addClass("wait-code-btn");
			    					var url="/eoip/web/sendSmsCode";
			    					var params={ phoneNumber:str};
			    					common.post(url,params,function(){
		    								$("#sendSmsCode").attr("title","60s后可重发");
		    								wait = 60;
		    								time_out(this);
		    								$("#codeTip").html("验证码已发送");
		    								send_flag = 1;
		    							},
		    							function(msg){
		    								$("#sendSmsCode").removeClass("wait-code-btn").addClass("get-code-btn");
		    								var error_str = "验证码已发送，请稍后重试。";
		    								if(typeof(msg.info) == "string") error_str = error_str +"code："+msg.code;
		    								$("#codeTip").html(error_str);
		    								return true;
			    					});
		    					} else {
		    						alert("当前手机号不可用");
	                				return false;
		    					}
		    					
	    					},function(msg){
		   						$("#sendSmsCode").removeClass("wait-code-btn").addClass("sendSmsCode");
		   						var error_str = msg.info;
		   						//if(typeof(msg.info) == "string") error_str = error_str +"code："+msg.code;
		   						$("#codeTip").html(error_str);
		   					}
	    				});//end ajax
	    				}
	    			});
    		
    		//3.0处理注册表单
    		$.validator.addMethod("valueNotEquals", function(value, element, arg){
				return arg != value;
			}, "Value must not equal arg.");
			
			$.validator.addMethod("isPhoneNum", function(value, element, arg){
			    var pattern = /(^(([0\+]\d{2,3}-)?(0\d{2,3})-)(\d{7,8})(-(\d{3,}))?$)|(^0{0,1}1[3|4|5|6|7|8|9][0-9]{9}$)/;
		        if(pattern.test(value)) { 
		            return true; 
		        }
		        return false;
			}, "Value must be a phone num");
			
		    $.validator.addMethod("isLandlineNum", function(value, element){     
		        var pattern =/^(([0\+]\d{2,3}-)?(0\d{2,3})-)(\d{7,8})(-(\d{1,}))?$/;  
		        if(value != '') {
		        	if(!pattern.exec(value)) {
		        		return false;
		        	}
		        }
		        return true;   
		    } , "<font color='red'>请输入有效的固定电话！</font>" );
			
		    $.validator.addMethod("isUserName", function(value, element){     
		        var pattern =/^[^\s]{2,20}$/;  
		        if(pattern.test(value)) { 
		            return true; 
		        }
		        return false; 
		    } , "<font color='green'>请输入有效的用户名！注意：用户名不允许空格</font>" );
		    
			$("#registerForm").validate({
				rules: {
					companyName: {
						required : true,
						remote: {
					        url: "checkCompanyName",
					        type: "post",
					        data: {
					        	companyName: function() {
					            	return $("#companyName").val();
					          	}
					        }
					    },
					    minlength: 2,
					    maxlength: 100
					},
					province: {
						valueNotEquals: "default"
					},
					city: {
						valueNotEquals: "default"
					},
					district: {
						valueNotEquals: "default"
					},
					realname: {
						required: true,
						isUserName: "",
					    minlength: 2,
						maxlength: 20
					},
					mobile: {
						required: true,
						isPhoneNum: "",
						remote: {
					        url: "checkUserMobile",
					        type: "post",
					        data: {
					        	currentUserId: function() {
					            	return "";
					          	},
					        	mobile: function() {
					            	return $("#mobile").val();
					          	}
					        }
					    }
					},
					password: {
						required: true,
						minlength: 6,
						maxlength: 14
					},
					confirmPass: {
						required: true,
						equalTo: "#password",
						minlength: 6,
						maxlength: 14
					},
					email: {
						required: true,
						email: true,
						remote: {
					        url: "checkUserEmail",
					        type: "post",
					        data: {
					        	currentUserId: function() {
					            	return "";
					          	},
					        	email: function() {
					            	return $("#email").val();
					          	}
					        }
					    }
					},
					verifyCode: {
						required: true,
						remote: {
					        url: "checkVerifyCode"
					    } 
					} 
				},
				messages: {
					companyName: {
						required : "名称不能为空",
						remote : "该企业或机构已注册",
						minlength : "名称太短",
						maxlength : "名称太长,请检查"
					},
					province:{ 
						valueNotEquals: "所在省不能为空"
					},
					city: {
						valueNotEquals: "所在市不能为空"
					},
					district: {
						valueNotEquals: "所在区不能为空"
					},
					contactor: {
						required: "联系人不能为空",
					    minlength: "请输入不小于2个字符",
					    isUserName: "请输入有效的用户名！注意：用户名不允许空格",
						maxlength: "请输入不超过20个字符"
					},
					mobile: {
						required: "手机不能为空",
						isPhoneNum: "请输入正确的手机号码",
						remote : "该手机号码已被使用"
					},
					landline: {
						required: "固话不能为空",
						isLandlineNum: "请输入正确的固话号码"
					},
					password: {
						required: "密码不能为空",
						minlength: "请输入6~14个字符",
						maxlength: "请输入6~14个字符"				
					},
					confirmPass: {
						required: "确认密码不能为空",
						equalTo: "确认密码与密码不一致",
						minlength: "请输入6~14个字符",
						maxlength: "请输入6~14个字符"	
					},
					email: {
						required: "邮箱不能为空",
						email: "请输入正确邮箱地址",
						remote : "该邮箱已注册"
					},
					verifyCode: {
				       required: "验证码不能为空",
				       remote: "验证码错误"
				    }
				},
				submitHandler : function(form) {
					debugger;
					$("#register-hint").text("正在运行,请稍后...").show();
					var companyName = $("#companyName").val();
					var companyType = "ENTERPRISE";
					var province = $("#province").val();
					var city = $("#city").val();
					var district = $("#district").val();
					
					var realname = $("#realname").val();
					var mobile = $("#mobile").val();
					var smsCode = $("#smsCode").val();
					var email = $("#email").val();
					var password = $("#password").val();
					
					var url = "/eoip/web/doRegister";
					var params = {  companyName:companyName,
									companyType:companyType,
									province:province,
									city:city,
									district:district,
									realname:realname,
									mobile:mobile,
									smsCode:smsCode,
									email:email,
									password:hex_sha1('' + $('#password').val()),
									};
					
				 	common.post(url, params, function (data) {
                        $("#register-hint").text('').show();
                        var data = jQuery.parseJSON(data);
                        if (data.code == "1") {
                            $("#register-hint").text('注册成功...').show();
                            alert('注册成功!');
                            location.href = '/eoip/web/login';
                        } else {
                            $("#register-hint").text(data.message).show();
                            $('#btn-register').removeAttr('disabled');
                        }//end if
                    });//end common post
				}
			});
    		
			//初始化省份数据
			util.remoteInvoke("getProvinceData", {}, function(data) {
				if(data) {
					for(var i = 0; i < data.length; i++) {
						var $option = $('<option></option>');
						$option.val(data[i].province);
						$option.text(data[i].province);
						$option.attr("provinceId", data[i].provinceId);
						$("#province").append($option);
					}
				}
			});
			
			$("#province").bind("change", function(e) {
				var provinceId = $("#province").find("option:selected").attr("provinceId");
				
				if(!provinceId) {
					$('#city').empty();
					var $option = $('<option></option>');
					$option.val(0);
					$option.text("请选择");
					$("#city").append($option);
					return false;
				}
				
				var params = {
					provinceId : provinceId
				};
				
				util.remoteInvoke("getCityData", params, function(data) {
					$('#city').empty();
					var $option = $('<option></option>');
					$option.val(0);
					$option.text("请选择");
					$("#city").append($option);
					
					if(data) {
						for(var i = 0; i < data.length; i++) {
							var $option = $('<option></option>');
							$option.val(data[i].city);
							$option.text(data[i].city);
							$option.attr("cityId", data[i].cityId);
							$("#city").append($option);
						}
					}
				});
			});
			
			$("#city").bind("change", function(e) {
				var cityId = $("#city").find("option:selected").attr("cityId");
				if(!cityId) {
					$('#district').empty();
					var $option = $('<option></option>');
					$option.val(0);
					$option.text("请选择");
					$("#district").append($option);
					return false;
				}
				
				var params = {
					cityId : cityId
				};
				util.remoteInvoke("getDistrictData", params, function(data) {
					$('#district').empty();
					var $option = $('<option></option>');
					$option.val(0);
					$option.text("请选择");
					$("#district").append($option);
					
					if(data) {
						for(var i = 0; i < data.length; i++) {
							var $option = $('<option></option>');
							$option.val(data[i].district);
							$option.text(data[i].district);
							$option.attr("districtId", data[i].districtId);
							$("#district").append($option);
						}
					}
				});
			});
    	});
    </script>
</body>
</html>
